/* PharmSimulator — системные страницы GetCourse: уведомления, ответы, профиль и переходы. Build 2026-09-10.6 */
@import url("https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0&icon_names=arrow_circle_left,arrow_outward,check,close,logout,notifications,notifications_unread,person,school,support_agent&display=block");
@font-face {
font-family: "Inter";
src: url("https://fs.getcourse.ru/fileservice/file/download/a/951490/sc/67/h/7b42507fac1e7f4092b84760e6e96846.ttf") format("truetype");
font-style: normal;
font-weight: 100 900;
font-display: swap;
}
:root {
--ps-system-canvas: #05080d;
--ps-system-surface: #0a0d13;
--ps-system-surface-secondary: #1e2025;
--ps-system-text: #fff;
--ps-system-text-secondary: #b4b4b6;
--ps-system-text-tertiary: #888ea1;
--ps-system-primary: #324bba;
--ps-system-primary-hover: #5976f6;
--ps-system-control-shadow: -58px 34px 9.5px rgba(59,72,131,0), -37px 21px 8.5px rgba(59,72,131,.01), -21px 12px 7.5px rgba(59,72,131,.05), -9px 5px 5.5px rgba(59,72,131,.09), -2px 1px 3px rgba(59,72,131,.1);
}
body:has(.gc-main-content.gc-user-user:not(.ps-page-ready))::before,
body.ps-page-leaving::before {
position: fixed;
inset: 0;
z-index: 21400;
content: "";
background: var(--ps-system-canvas);
opacity: 1;
pointer-events: all;
}
body:has(.gc-main-content.gc-user-user:not(.ps-page-ready))::after,
body.ps-page-leaving::after {
position: fixed;
top: 50%;
left: 50%;
z-index: 21401;
width: 32px;
height: 32px;
content: "";
border: 3px solid var(--ps-system-surface-secondary);
border-top-color: var(--ps-system-primary-hover);
border-radius: 50%;
animation: ps-system-spin .75s linear infinite;
pointer-events: none;
}
body.ps-page-leaving::before {
animation: ps-system-layer-in .18s ease both;
}
body.ps-page-leaving::after {
animation: ps-system-spinner-in .18s ease both, ps-system-spin .75s linear .18s infinite;
}
.gc-main-content.gc-user-user.ps-page-ready {
animation: ps-system-page-in .24s ease both;
}
@keyframes ps-system-spin {
from { transform: translate(-50%, -50%) rotate(0deg); }
to { transform: translate(-50%, -50%) rotate(360deg); }
}
@keyframes ps-system-layer-in {
from { opacity: 0; }
to { opacity: 1; }
}
@keyframes ps-system-spinner-in {
from { opacity: 0; transform: translate(-50%, -50%) scale(.85); }
to { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}
@keyframes ps-system-page-in {
from { opacity: 0; transform: translateY(6px); }
to { opacity: 1; transform: none; }
}
html body.ps-notifications-route .gc-main-content.gc-user-user {
min-height: 100vh;
overflow-x: hidden;
color: var(--ps-system-text);
background: var(--ps-system-canvas);
font-family: Inter, Arial, sans-serif;
}
html body.ps-notifications-route .gc-main-content.gc-user-user .main-page-block > .main-page-container {
width: 100%;
max-width: none;
margin: 0;
padding: 64px 24px 24px;
}
html body.ps-notifications-route .gc-main-content.gc-user-user .page-header {
margin: 0 0 40px !important;
}
html body.ps-notifications-route .gc-main-content.gc-user-user .page-header h1 {
width: min(871px, 100%);
margin: 0;
color: var(--ps-system-text);
font: 500 40px/40px Inter, Arial, sans-serif !important;
letter-spacing: -1.6px;
}
html body.ps-notifications-route .gc-main-content.gc-user-user .user-notifications {
display: flex;
width: 100%;
flex-direction: column;
gap: 16px;
}
html body.ps-notifications-route .gc-main-content.gc-user-user .notification-group {
position: relative;
display: grid !important;
width: 100%;
min-width: 0;
min-height: 100px;
grid-template-columns: minmax(0, 1fr) 30px;
grid-template-rows: 17px auto;
align-items: start;
gap: 10px 24px;
margin: 0 !important;
padding: 24px !important;
overflow: hidden;
color: var(--ps-system-text) !important;
text-decoration: none !important;
border: 0 !important;
border-radius: 16px !important;
background: var(--ps-system-surface) !important;
box-shadow: none !important;
opacity: 1;
transform: none !important;
transition: none !important;
}
html body.ps-notifications-route .gc-main-content.gc-user-user .notification-group:not(.notification-status-viewed) {
background: var(--ps-system-surface) !important;
opacity: 1;
}
html body.ps-notifications-route .gc-main-content.gc-user-user .notification-group:hover,
html body.ps-notifications-route .gc-main-content.gc-user-user .notification-group:focus-visible {
color: var(--ps-system-text) !important;
border-color: transparent !important;
background: var(--ps-system-surface) !important;
box-shadow: none !important;
transform: none !important;
}
html body.ps-notifications-route .gc-main-content.gc-user-user .notification-group::after {
position: static;
inset: auto;
display: grid;
width: 30px;
height: 30px;
grid-column: 2;
grid-row: 1 / 3;
place-items: center;
align-self: start;
margin: 0;
padding: 8px;
box-sizing: border-box;
content: "arrow_outward";
color: #fff;
font-family: "Material Symbols Outlined";
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 1;
border: 0;
border-radius: 50%;
background: var(--ps-system-primary);
box-shadow: var(--ps-system-control-shadow);
font-feature-settings: "liga";
opacity: 1;
transform: none;
transition: background-color .2s ease, box-shadow .2s ease;
}
html body.ps-notifications-route .gc-main-content.gc-user-user .notification-group:hover::after,
html body.ps-notifications-route .gc-main-content.gc-user-user .notification-group:focus-visible::after {
border-color: transparent;
background: var(--ps-system-primary-hover);
box-shadow: var(--ps-system-control-shadow);
}
html body.ps-notifications-route .gc-main-content.gc-user-user .notification-group:focus-visible {
outline: 2px solid var(--ps-system-primary-hover);
outline-offset: 2px;
}
html body.ps-notifications-route .gc-main-content.gc-user-user .notification-group.notification-status-viewed {
background: var(--ps-system-surface) !important;
opacity: .7;
}
html body.ps-notifications-route .gc-main-content.gc-user-user .notification-group.notification-status-viewed::after {
border: 1px solid var(--ps-system-surface-secondary);
background: var(--ps-system-surface-secondary);
box-shadow: none;
}
html body.ps-notifications-route .gc-main-content.gc-user-user .notification-group.notification-status-viewed:hover::after,
html body.ps-notifications-route .gc-main-content.gc-user-user .notification-group.notification-status-viewed:focus-visible::after {
border-color: transparent;
background: var(--ps-system-primary-hover);
box-shadow: var(--ps-system-control-shadow);
}
html body.ps-notifications-route .gc-main-content.gc-user-user .notification-group .user-image {
display: none !important;
}
html body.ps-notifications-route .gc-main-content.gc-user-user .notification-group .date {
position: static !important;
inset: auto !important;
display: block !important;
width: min(694px, 100%) !important;
max-width: 694px !important;
grid-column: 1;
grid-row: 1;
min-width: 0;
height: auto !important;
margin: 0 !important;
padding: 0 !important;
float: none !important;
color: var(--ps-system-text-secondary);
font: 400 12px/17px Inter, Arial, sans-serif;
letter-spacing: -.1px;
text-align: left;
}
html body.ps-notifications-route .gc-main-content.gc-user-user .notification-group .content {
position: static !important;
display: block !important;
width: min(694px, 100%) !important;
max-width: 694px !important;
min-width: 0;
grid-column: 1;
grid-row: 2;
margin: 0 !important;
padding: 0 !important;
float: none !important;
color: var(--ps-system-text);
}
html body.ps-notifications-route .gc-main-content.gc-user-user .notification-group-link {
display: block;
width: 100% !important;
max-width: none !important;
min-width: 0;
overflow: hidden;
color: inherit !important;
font: 400 18px/25px Inter, Arial, sans-serif;
letter-spacing: -.5px;
text-decoration: none !important;
text-overflow: ellipsis;
white-space: nowrap;
}
html body.ps-notifications-route .gc-main-content.gc-user-user .notification-group:not(.notification-status-viewed) .notification-group-link {
font-weight: 400 !important;
}
html body.ps-notifications-route .gc-main-content.gc-user-user .notification-group > :where(.clear, div[style*="float"]) {
display: none !important;
}
html body.ps-answers-route,
html body.ps-answers-route .gc-main-content.gc-user-user,
html body.ps-answers-route .gc-main-content.gc-user-user :where(.page-full-block, .main-page-block) {
min-height: 100%;
color: var(--ps-system-text);
background: var(--ps-system-canvas) !important;
font-family: Inter, Arial, sans-serif;
}
html body.ps-answers-route .gc-main-content.gc-user-user,
html body.ps-answers-route .gc-main-content.gc-user-user * {
box-sizing: border-box;
}
html body.ps-answers-route .gc-main-content.gc-user-user .main-page-block > .main-page-container {
width: 100%;
max-width: none;
margin: 0;
padding: 64px 24px 120px;
}
html body.ps-answers-route .gc-main-content.gc-user-user :where(.gc-account-logo, .empty-breadcrumbs, .content-menu, .answers-page-filter-toggler, .row > .answers-page-filter, .row > .view-lesson-mission, .b-like-and-subscribe-notifications) {
display: none !important;
}
html body.ps-answers-route .gc-main-content.gc-user-user .ps-answers-back {
display: inline-flex;
width: fit-content;
align-items: center;
gap: 8px;
margin: 0 0 32px;
color: var(--ps-system-text-secondary);
font: 600 14px/20px Inter, Arial, sans-serif;
letter-spacing: -.28px;
text-decoration: none;
transition: color .2s ease;
}
html body.ps-answers-route .gc-main-content.gc-user-user .ps-answers-back:hover,
html body.ps-answers-route .gc-main-content.gc-user-user .ps-answers-back:focus-visible {
color: var(--ps-system-text);
text-decoration: none;
outline: 0;
}
html body.ps-answers-route .gc-main-content.gc-user-user .ps-answers-back .ps-material-symbol {
font-size: 18px;
}
html body.ps-answers-route .gc-main-content.gc-user-user .page-header {
display: flex;
align-items: center;
justify-content: space-between;
gap: 24px;
margin: 0 0 40px !important;
padding: 0 !important;
border: 0;
}
html body.ps-answers-route .gc-main-content.gc-user-user .page-header h1 {
order: 1;
margin: 0;
color: var(--ps-system-text);
font: 500 40px/40px Inter, Arial, sans-serif !important;
letter-spacing: -1.6px;
}
html body.ps-answers-route .gc-main-content.gc-user-user .page-actions {
position: static;
order: 2;
margin: 0;
}
html body.ps-answers-route .gc-main-content.gc-user-user .page-actions .btn {
display: inline-flex;
min-height: 52px;
align-items: center;
justify-content: center;
padding: 16px 24px;
color: #fff;
font: 600 14px/20px Inter, Arial, sans-serif;
letter-spacing: -.28px;
border: 1px solid var(--ps-system-primary);
border-radius: 100px;
background: var(--ps-system-primary);
box-shadow: -21px 12px 15px rgba(59,72,131,.05), -9px 5px 11px rgba(59,72,131,.09), -2px 1px 6px rgba(59,72,131,.1);
transition: border-color .2s ease, background-color .2s ease;
}
html body.ps-answers-route .gc-main-content.gc-user-user .page-actions .btn:hover,
html body.ps-answers-route .gc-main-content.gc-user-user .page-actions .btn:focus-visible {
color: #fff;
border-color: var(--ps-system-primary-hover);
background: var(--ps-system-primary-hover);
outline: 0;
}
html body.ps-answers-route .gc-main-content.gc-user-user > .page-full-block .main-page-container > br {
display: none;
}
html body.ps-answers-route .gc-main-content.gc-user-user .main-page-container > .row {
display: block;
width: 100%;
margin: 0;
}
html body.ps-answers-route .gc-main-content.gc-user-user .main-page-container > .row > .answers-list {
width: 100%;
margin: 0;
padding: 0;
float: none;
}
html body.ps-answers-route .gc-main-content.gc-user-user .main-page-container > .row > .answers-list > h3 {
margin: 0 0 16px;
color: var(--ps-system-text);
font: 400 18px/25px Inter, Arial, sans-serif;
letter-spacing: -.5px;
}
html body.ps-answers-route .gc-main-content.gc-user-user .answer_wrapper {
position: relative;
width: 100%;
min-height: 0;
margin: 0;
padding: 24px;
color: var(--ps-system-text);
border: 0;
border-radius: 16px;
background: var(--ps-system-surface);
}
html body.ps-answers-route .gc-main-content.gc-user-user .answer_wrapper > .user-image {
display: none !important;
}
html body.ps-answers-route .gc-main-content.gc-user-user .answer-content {
width: 100%;
margin: 0 !important;
padding: 0 !important;
color: var(--ps-system-text);
font: 400 14px/20px Inter, Arial, sans-serif;
letter-spacing: -.2px;
}
html body.ps-answers-route .gc-main-content.gc-user-user .answer-content > .title {
display: flex;
min-width: 0;
align-items: center;
gap: 8px;
min-height: 48px;
margin: 0 220px 0 0;
color: var(--ps-system-text-secondary);
}
html body.ps-answers-route .gc-main-content.gc-user-user .answer-content > .title .user-image,
html body.ps-answers-route .gc-main-content.gc-user-user .answer-content > .title .user-image img {
display: block;
width: 48px !important;
height: 48px !important;
flex: 0 0 48px;
margin: 0;
border-radius: 50%;
object-fit: cover;
background: var(--ps-system-surface-secondary);
}
html body.ps-answers-route .gc-main-content.gc-user-user .answer-content a {
color: var(--ps-system-primary-hover);
}
html body.ps-answers-route .gc-main-content.gc-user-user .answer-content .user-profile-link {
color: var(--ps-system-text);
font-weight: 600;
text-decoration: none;
}
html body.ps-answers-route .gc-main-content.gc-user-user .ps-answer-author-copy {
display: flex;
min-width: 0;
align-items: center;
gap: 8px;
}
html body.ps-answers-route .gc-main-content.gc-user-user .answer-content .answer-date,
html body.ps-answers-route .gc-main-content.gc-user-user .answer-content .answer-date a {
color: var(--ps-system-text-secondary) !important;
font-weight: 400;
text-decoration: none !important;
}
html body.ps-answers-route .gc-main-content.gc-user-user .answer-content .answer-date {
font-size: 0;
white-space: nowrap;
}
html body.ps-answers-route .gc-main-content.gc-user-user .answer-content .answer-date::before {
margin-right: 8px;
content: "•";
font: 400 14px/20px Inter, Arial, sans-serif;
}
html body.ps-answers-route .gc-main-content.gc-user-user .answer-content .answer-date a {
font: 400 14px/20px Inter, Arial, sans-serif;
}
html body.ps-answers-route .gc-main-content.gc-user-user .answer-status {
position: absolute;
top: 24px;
right: 24px;
float: none;
}
html body.ps-answers-route .gc-main-content.gc-user-user .answer-status-label {
display: inline-flex;
align-items: center;
gap: 4px;
padding: 8px;
color: var(--ps-system-text-secondary);
font: 600 12px/17px Inter, Arial, sans-serif;
letter-spacing: -.1px;
border: 0;
border-radius: 8px;
background: var(--ps-system-surface-secondary);
}
html body.ps-answers-route .gc-main-content.gc-user-user .status-declined .answer-status-label {
color: #ff9b93;
background: rgba(236,75,63,.16);
}
html body.ps-answers-route .gc-main-content.gc-user-user .status-accepted .answer-status-label {
color: #79dc9b;
background: rgba(51,176,93,.16);
}
html body.ps-answers-route .gc-main-content.gc-user-user .answer-main-content {
margin-top: 24px;
}
html body.ps-answers-route .gc-main-content.gc-user-user .ps-answer-result {
display: flex;
align-items: baseline;
gap: 4px;
margin-top: 24px;
padding-top: 24px;
color: var(--ps-system-text-secondary);
border-top: 1px solid var(--ps-system-surface-secondary);
font: 400 14px/20px Inter, Arial, sans-serif;
}
html body.ps-answers-route .gc-main-content.gc-user-user .ps-answer-result b {
color: var(--ps-system-text);
font-weight: 600;
}
html body.ps-answers-route .gc-main-content.gc-user-user .answer-main-content .main:empty {
display: none;
}
html body.ps-answers-route .gc-main-content.gc-user-user :where(.answer-main-content.ps-is-empty, .comments.ps-is-empty) {
display: none !important;
}
html body.ps-answers-route .gc-main-content.gc-user-user .comments:not(:empty) {
margin-top: 24px;
padding-top: 24px;
border-top: 1px solid var(--ps-system-surface-secondary);
}
@media (max-width: 767px) {
html body.ps-notifications-route .gc-main-content.gc-user-user .main-page-block > .main-page-container,
html body.ps-answers-route .gc-main-content.gc-user-user .main-page-block > .main-page-container {
padding: 24px 14px calc(112px + env(safe-area-inset-bottom, 0px));
}
html body.ps-notifications-route .gc-main-content.gc-user-user .page-header {
margin-bottom: 128px !important;
}
html body.ps-notifications-route .gc-main-content.gc-user-user .page-header h1,
html body.ps-answers-route .gc-main-content.gc-user-user .page-header h1 {
width: 100%;
font-size: 30px !important;
line-height: 30px !important;
letter-spacing: -1.2px;
}
html body.ps-notifications-route .gc-main-content.gc-user-user .notification-group {
min-height: 119px;
gap: 10px 16px;
padding: 24px !important;
}
html body.ps-notifications-route .gc-main-content.gc-user-user .notification-group-link {
display: -webkit-box;
font-size: 16px;
line-height: 22px;
white-space: normal;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
html body.ps-notifications-route .gc-main-content.gc-user-user .notification-group :where(.date, .content) {
width: 100% !important;
max-width: none !important;
}
html body.ps-answers-route .gc-main-content.gc-user-user .ps-answers-back {
margin-bottom: 32px;
}
html body.ps-answers-route .gc-main-content.gc-user-user .page-header {
flex-direction: column;
align-items: stretch;
gap: 24px;
margin-bottom: 40px !important;
}
html body.ps-answers-route .gc-main-content.gc-user-user .page-actions,
html body.ps-answers-route .gc-main-content.gc-user-user .page-actions .btn {
width: 100%;
}
html body.ps-answers-route .gc-main-content.gc-user-user .main-page-container > .row > .answers-list > h3 {
font-size: 16px;
line-height: 22px;
letter-spacing: -.4px;
}
html body.ps-answers-route .gc-main-content.gc-user-user .answer_wrapper {
min-height: 0;
padding: 24px;
}
html body.ps-answers-route .gc-main-content.gc-user-user .answer-status {
position: static;
margin: 0 0 24px;
}
html body.ps-answers-route .gc-main-content.gc-user-user .answer-content > .title {
min-height: 40px;
margin-right: 0;
}
html body.ps-answers-route .gc-main-content.gc-user-user .ps-answer-author-copy {
flex-direction: column;
align-items: flex-start;
gap: 2px;
}
html body.ps-answers-route .gc-main-content.gc-user-user .answer-content .answer-date::before {
display: none;
}
html body.ps-answers-route .gc-main-content.gc-user-user .answer-content .answer-date a {
font-size: 12px;
line-height: 17px;
}
html body.ps-answers-route .gc-main-content.gc-user-user .ps-answer-result {
margin-top: 20px;
padding-top: 20px;
}
}
@media (prefers-reduced-motion: reduce) {
.gc-main-content.gc-user-user.ps-page-ready,
body.ps-page-leaving::before,
body.ps-page-leaving::after {
animation-duration: .01ms !important;
}
}
body.ps-menu-installed .gc-main-content.with-left-menu {
margin-left: 73px !important;
}
body.ps-support-open {
overflow: hidden !important;
}
body.ps-menu-installed .talks-widget-button {
display: none !important;
}
#gcAccountUserMenu.ps-menu-ready {
--pm-bar: #fff;
--pm-group: #f5f6f8;
--pm-button: #fff;
--pm-active: #eef0f4;
--pm-icon: #68707e;
--pm-icon-active: #1c1c1e;
--pm-tip-bg: #1c1c1e;
--pm-tip-text: #fff;
--pm-border: #e7e9ee;
}
#gcAccountUserMenu.ps-menu-ready.ps-menu-dark {
--pm-bar: #0a0d13;
--pm-group: #05080d;
--pm-button: #0a0d13;
--pm-active: #1e2025;
--pm-icon: #68707e;
--pm-icon-active: #fff;
--pm-tip-bg: #fff;
--pm-tip-text: #0a0d13;
--pm-border: #171c25;
}
#gcAccountUserMenu.ps-menu-ready .gc-page-nav-items-menu {
display: none !important;
}
#gcAccountUserMenu.ps-menu-ready .gc-account-leftbar {
position: fixed !important;
inset: 0 auto 0 0 !important;
z-index: 10002 !important;
width: 73px !important;
height: 100dvh !important;
padding: 0 !important;
border: 0 !important;
background: var(--pm-bar) !important;
box-shadow: none !important;
}
#gcAccountUserMenu.ps-menu-ready .ps-menu {
display: flex;
width: 100%;
height: 100%;
flex-direction: column;
align-items: center;
justify-content: space-between;
padding: 8px;
font-family: Inter, Arial, sans-serif;
box-sizing: border-box;
}
#gcAccountUserMenu.ps-menu-ready .ps-menu,
#gcAccountUserMenu.ps-menu-ready .ps-menu * {
box-sizing: border-box;
}
#gcAccountUserMenu.ps-menu-ready :where(.ps-menu-profile, .ps-menu-group) {
display: flex;
width: 56px;
flex: 0 0 auto;
align-items: center;
justify-content: center;
padding: 4px;
border: 0;
border-radius: 1000px;
background: var(--pm-group);
}
#gcAccountUserMenu.ps-menu-ready .ps-menu-profile {
position: relative;
height: 56px;
color: var(--pm-icon);
text-decoration: none;
cursor: pointer;
outline: 0;
}
#gcAccountUserMenu.ps-menu-ready .ps-menu-profile img {
display: block;
width: 48px;
height: 48px;
max-width: none;
border-radius: 50%;
object-fit: cover;
}
#gcAccountUserMenu.ps-menu-ready .ps-menu-profile > .ps-menu-icon {
display: grid;
width: 48px;
height: 48px;
place-items: center;
border-radius: 50%;
background: var(--pm-button);
}
#gcAccountUserMenu.ps-menu-ready .ps-menu-main {
height: 168px;
flex-direction: column;
gap: 8px;
}
#gcAccountUserMenu.ps-menu-ready .ps-menu-logout {
height: 56px;
}
#gcAccountUserMenu.ps-menu-ready .ps-menu-btn {
position: relative;
display: grid;
width: 48px;
height: 48px;
flex: 0 0 48px;
place-items: center;
padding: 0;
color: var(--pm-icon);
text-decoration: none;
border: 0;
border-radius: 100px;
background: var(--pm-button);
cursor: pointer;
outline: 0;
transform: none;
transition: color .2s ease, background-color .2s ease;
}
#gcAccountUserMenu.ps-menu-ready :where(.ps-menu-btn:hover, .ps-menu-btn:focus-visible, .ps-menu-btn.is-active),
#gcAccountUserMenu.ps-menu-ready :where(.ps-menu-profile:hover, .ps-menu-profile:focus-visible, .ps-menu-profile.is-active) > .ps-menu-icon {
color: var(--pm-icon-active);
background: var(--pm-active);
transform: none;
}
#gcAccountUserMenu.ps-menu-ready :where(.ps-menu-btn:focus-visible, .ps-menu-profile:focus-visible) {
outline: 2px solid #5976f6;
outline-offset: 2px;
}
#gcAccountUserMenu.ps-menu-ready .ps-menu-icon {
font-family: "Material Symbols Outlined";
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 1;
letter-spacing: normal;
text-transform: none;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
font-feature-settings: "liga";
font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;
-webkit-font-feature-settings: "liga";
-webkit-font-smoothing: antialiased;
}
#gcAccountUserMenu.ps-menu-ready .ps-menu-profile > .ps-menu-icon {
font-size: 22px;
}
#gcAccountUserMenu.ps-menu-ready [data-ps-tip]::after {
position: absolute;
top: 50%;
left: calc(100% + 8px);
z-index: 2;
padding: 10px 15px;
content: attr(data-ps-tip);
color: var(--pm-tip-text);
font-size: 10px;
font-weight: 600;
line-height: 14px;
white-space: nowrap;
border-radius: 8px;
background: var(--pm-tip-bg);
opacity: 0;
pointer-events: none;
transform: translateY(-50%);
transition: opacity .2s ease;
}
#gcAccountUserMenu.ps-menu-ready [data-ps-tip]::before {
position: absolute;
top: 50%;
left: calc(100% + 3px);
z-index: 3;
width: 6px;
height: 12px;
content: "";
background: var(--pm-tip-bg);
clip-path: polygon(100% 0, 0 50%, 100% 100%);
opacity: 0;
pointer-events: none;
transform: translateY(-50%);
transition: opacity .2s ease;
}
#gcAccountUserMenu.ps-menu-ready [data-ps-tip]:is(:hover, :focus-visible)::before,
#gcAccountUserMenu.ps-menu-ready [data-ps-tip]:is(:hover, :focus-visible)::after {
opacity: 1;
}
.ps-support-layer {
position: fixed;
inset: 0;
z-index: 11000;
display: flex;
align-items: flex-start;
justify-content: center;
padding: 24px;
background: #05080d;
opacity: 0;
visibility: hidden;
pointer-events: none;
transition: opacity .2s ease, visibility 0s linear .2s;
}
.ps-support-layer.is-open {
opacity: 1;
visibility: visible;
pointer-events: auto;
transition-delay: 0s;
}
.ps-support-dialog {
position: relative;
width: min(760px, 100%);
height: calc(100dvh - 48px);
max-height: 900px;
padding-right: 12px;
overflow: hidden;
overscroll-behavior: contain;
box-sizing: border-box;
background: #05080d;
opacity: 0;
transform: translateY(12px);
transition: opacity .2s ease, transform .2s ease;
}
.ps-support-layer.is-open .ps-support-dialog {
opacity: 1;
transform: none;
}
.ps-support-frame {
display: block;
width: 100%;
height: 100%;
overflow: auto;
border: 0;
background: #05080d;
}
.ps-support-close {
position: absolute;
top: 8px;
right: 20px;
z-index: 2;
width: 44px;
height: 44px;
padding: 0;
border: 0;
border-radius: 100px;
background: #1e2025;
cursor: pointer;
transition: background-color .2s ease;
}
.ps-support-close::before,
.ps-support-close::after {
position: absolute;
top: 21px;
left: 12px;
width: 20px;
height: 2px;
content: "";
border-radius: 2px;
background: #fff;
transform: rotate(45deg);
}
.ps-support-close::after {
transform: rotate(-45deg);
}
.ps-support-close:is(:hover, :focus-visible) {
background: #324bba;
outline: 0;
}
body.ps-profile-panel-open {
overflow: hidden !important;
}
html:has(body.ps-profile-panel-open) {
overflow: hidden !important;
}
.ps-profile-layer {
--ps-profile-canvas: #f5f6f8;
--ps-profile-surface: #fff;
--ps-profile-surface-hover: #eef0f4;
--ps-profile-text: #1e2025;
--ps-profile-muted: #68707e;
--ps-profile-tertiary: #888ea1;
--ps-profile-border: #e7e9ee;
--ps-profile-primary: #324bba;
--ps-profile-primary-hover: #5976f6;
position: fixed;
inset: 0;
z-index: 10001;
overflow-x: hidden;
overflow-y: auto;
overscroll-behavior: contain;
color: var(--ps-profile-text);
background: var(--ps-profile-canvas);
color-scheme: light;
font-family: Inter, Arial, sans-serif;
opacity: 0;
visibility: hidden;
pointer-events: none;
transition: opacity .2s ease, visibility 0s linear .2s;
}
body:has(#gcAccountUserMenu.ps-menu-ready) .ps-profile-layer {
left: 73px;
}
.ps-profile-layer.is-open {
opacity: 1;
visibility: visible;
pointer-events: auto;
transition-delay: 0s;
}
.ps-profile-layer,
.ps-profile-layer *,
.ps-profile-layer *::before,
.ps-profile-layer *::after {
box-sizing: border-box;
}
.ps-profile-panel {
width: 100%;
min-height: 100dvh;
margin: 0 auto;
padding: 64px 24px;
}
.ps-profile-panel-header {
display: flex;
width: 100%;
align-items: center;
justify-content: space-between;
gap: 24px;
margin: 0 0 24px;
}
.ps-profile-panel-header h1 {
margin: 0;
color: var(--ps-profile-text);
font: 500 40px/40px Inter, Arial, sans-serif;
letter-spacing: -1.6px;
}
.ps-profile-panel-close {
display: grid;
width: 48px;
height: 48px;
flex: 0 0 48px;
place-items: center;
padding: 0;
color: var(--ps-profile-muted);
border: 1px solid var(--ps-profile-border);
border-radius: 50%;
background: var(--ps-profile-surface);
box-shadow: none;
cursor: pointer;
transform: none;
transition: color .2s ease, border-color .2s ease, background-color .2s ease;
}
.ps-profile-panel-close span {
font-family: "Material Symbols Outlined";
font-size: 22px;
font-style: normal;
font-weight: 400;
line-height: 1;
font-feature-settings: "liga";
font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;
}
.ps-profile-panel-close:is(:hover, :focus-visible) {
color: var(--ps-profile-primary-hover);
border-color: var(--ps-profile-primary-hover);
background: var(--ps-profile-surface);
outline: 0;
}
.ps-profile-panel-nav {
display: flex;
width: max-content;
max-width: 100%;
gap: 4px;
margin: 0 0 40px;
padding: 4px;
overflow-x: auto;
border: 1px solid var(--ps-profile-border);
border-radius: 100px;
background: var(--ps-profile-surface);
scrollbar-width: none;
}
.ps-profile-panel-nav::-webkit-scrollbar {
display: none;
}
.ps-profile-panel-nav__item {
display: flex;
min-height: 40px;
flex: 0 0 auto;
align-items: center;
justify-content: center;
padding: 10px 16px;
color: var(--ps-profile-muted);
font-size: 14px;
font-weight: 500;
line-height: 20px;
white-space: nowrap;
text-decoration: none;
border: 0;
border-radius: 100px;
background: transparent;
transform: none;
transition: color .2s ease, background-color .2s ease;
}
.ps-profile-panel-nav__item.is-active,
.ps-profile-panel-nav__item:is(:hover, :focus-visible) {
color: var(--ps-profile-text);
background: var(--ps-profile-surface-hover);
outline: 0;
}
.ps-profile-panel-nav__item[hidden] {
display: none !important;
}
.ps-profile-panel-status {
margin: 0 0 16px;
padding: 14px 16px;
color: var(--ps-profile-muted);
font-size: 14px;
line-height: 20px;
border: 1px solid var(--ps-profile-border);
border-radius: 12px;
background: var(--ps-profile-surface);
}
.ps-profile-panel-status.is-success {
color: #216e45;
border-color: #b7dfc8;
background: #edf8f1;
}
.ps-profile-panel-status.is-error {
color: #a93c3c;
border-color: #efc6c6;
background: #fff1f1;
}
.ps-profile-panel-status.is-loading {
color: var(--ps-profile-muted);
}
html body .ps-profile-layer .gc-main-content.gc-user-user.ps-profile-panel-page {
width: 100% !important;
min-height: 0 !important;
margin: 0 !important;
overflow: visible !important;
background: transparent !important;
}
html body .ps-profile-layer .gc-main-content.gc-user-user.ps-profile-panel-page > .container {
width: 100% !important;
max-width: none !important;
min-height: 0 !important;
margin: 0 !important;
padding: 0 !important;
}
.ps-profile-panel-content {
width: 100%;
}
.ps-profile-panel-loading,
.ps-profile-panel-error {
display: flex;
min-height: 260px;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 12px;
padding: 32px;
text-align: center;
border-radius: 16px;
background: var(--ps-profile-surface);
}
.ps-profile-panel-loading span {
width: 32px;
height: 32px;
border: 3px solid var(--ps-profile-border);
border-top-color: var(--ps-profile-primary-hover);
border-radius: 50%;
animation: ps-profile-spin .75s linear infinite;
}
.ps-profile-panel-loading p,
.ps-profile-panel-error p {
margin: 0;
color: var(--ps-profile-muted);
font-size: 14px;
line-height: 20px;
}
.ps-profile-panel-error h2 {
margin: 0;
color: var(--ps-profile-text);
font: 500 22px/31px Inter, Arial, sans-serif;
letter-spacing: -.7px;
}
.ps-profile-panel-error a {
color: var(--ps-profile-primary);
font-size: 14px;
font-weight: 600;
}
@keyframes ps-profile-spin {
to { transform: rotate(360deg); }
}
body.ps-profile-route,
body.ps-profile-settings-route,
body.ps-public-profile-route {
--ps-profile-canvas: #f5f6f8;
--ps-profile-surface: #fff;
--ps-profile-surface-hover: #eef0f4;
--ps-profile-text: #1e2025;
--ps-profile-muted: #68707e;
--ps-profile-tertiary: #888ea1;
--ps-profile-border: #e7e9ee;
--ps-profile-primary: #324bba;
--ps-profile-primary-hover: #5976f6;
color: var(--ps-profile-text);
background: var(--ps-profile-canvas) !important;
}
body.ps-profile-route:has(.gc-main-content.gc-user-user:not(.ps-page-ready))::before,
body.ps-profile-settings-route:has(.gc-main-content.gc-user-user:not(.ps-page-ready))::before {
background: var(--ps-profile-canvas);
}
body.ps-profile-route:has(.gc-main-content.gc-user-user:not(.ps-page-ready))::after,
body.ps-profile-settings-route:has(.gc-main-content.gc-user-user:not(.ps-page-ready))::after {
border-color: var(--ps-profile-border);
border-top-color: var(--ps-profile-primary-hover);
}
html body :where(.gc-main-content.gc-user-user.ps-profile-page, .gc-main-content.gc-user-user.ps-profile-settings-page) {
min-height: 100vh;
overflow-x: clip;
color: var(--ps-profile-text);
background: var(--ps-profile-canvas);
font-family: Inter, Arial, sans-serif !important;
}
html body .gc-main-content.gc-user-user.ps-public-profile-page {
min-height: 100vh;
overflow-x: clip;
color: var(--ps-profile-text);
background: var(--ps-profile-canvas);
font-family: Inter, Arial, sans-serif !important;
}
html body .gc-main-content.gc-user-user.ps-public-profile-page,
html body .gc-main-content.gc-user-user.ps-public-profile-page *,
html body .gc-main-content.gc-user-user.ps-public-profile-page *::before,
html body .gc-main-content.gc-user-user.ps-public-profile-page *::after {
box-sizing: border-box;
}
html body .gc-main-content.gc-user-user.ps-public-profile-page > .container {
width: 100% !important;
max-width: none !important;
min-height: 100vh;
margin: 0 !important;
padding: 64px 24px !important;
}
html body .gc-main-content.gc-user-user.ps-public-profile-page :where(.standard-logo, .empty-breadcrumbs, .breadcrumbs) {
display: none !important;
}
html body .gc-main-content.gc-user-user.ps-public-profile-page :where(.standard-page-content, .xdget-root, .xdget-userProfileSystemPage, .page-full-block, .area-PAGE, .layout-fixwidth) {
width: 100% !important;
max-width: none !important;
min-height: 0 !important;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
background: transparent !important;
}
html body .gc-main-content.gc-user-user.ps-public-profile-page .ps-public-profile-header {
display: flex;
width: 100%;
align-items: center;
justify-content: space-between;
gap: 24px;
margin: 0 0 40px;
}
html body .gc-main-content.gc-user-user.ps-public-profile-page .xdget-profileTitle {
margin: 0 !important;
color: var(--ps-profile-text) !important;
font: 500 40px/40px Inter, Arial, sans-serif !important;
letter-spacing: -1.6px !important;
}
html body .gc-main-content.gc-user-user.ps-public-profile-page .edit-profile-popup-btn {
position: static !important;
display: inline-flex !important;
min-width: 200px;
min-height: 52px;
align-items: center;
justify-content: center;
gap: 8px;
margin: 0 !important;
padding: 14px 24px !important;
color: #fff !important;
font-size: 14px !important;
font-weight: 600 !important;
line-height: 20px !important;
border: 0 !important;
border-radius: 100px !important;
background: var(--ps-profile-primary) !important;
box-shadow: var(--ps-system-control-shadow) !important;
transform: none !important;
transition: background-color .2s ease !important;
}
html body .gc-main-content.gc-user-user.ps-public-profile-page .edit-profile-popup-btn:is(:hover, :focus-visible) {
background: var(--ps-profile-primary-hover) !important;
outline: 0 !important;
}
html body .gc-main-content.gc-user-user.ps-public-profile-page .layout-fixwidth > .xdget-row {
display: grid !important;
width: 100% !important;
grid-template-columns: minmax(240px, 320px) minmax(0, 1fr);
gap: 16px;
margin: 0 !important;
}
html body .gc-main-content.gc-user-user.ps-public-profile-page .layout-fixwidth > .xdget-row > .xdget-container {
width: auto !important;
min-width: 0;
margin: 0 !important;
padding: 24px !important;
float: none !important;
border-radius: 16px;
background: var(--ps-profile-surface);
}
html body .gc-main-content.gc-user-user.ps-public-profile-page .xdget-profileAvatar {
width: 100%;
margin: 0 0 24px !important;
}
html body .gc-main-content.gc-user-user.ps-public-profile-page .xdget-profileAvatar img {
display: block;
width: 100% !important;
max-width: 232px !important;
height: auto !important;
aspect-ratio: 1;
margin: 0;
border: 0;
border-radius: 16px;
background: var(--ps-profile-canvas);
object-fit: cover;
}
html body .gc-main-content.gc-user-user.ps-public-profile-page .xdget-profileInfo {
color: var(--ps-profile-muted);
font-size: 14px;
font-weight: 400;
line-height: 20px;
}
html body .gc-main-content.gc-user-user.ps-public-profile-page .xdget-profileLike {
margin-top: 20px;
}
html body .gc-main-content.gc-user-user.ps-public-profile-page .xdget-profileLike .button {
display: inline-flex;
min-height: 40px;
align-items: center;
padding: 10px 16px;
color: var(--ps-profile-text);
font-size: 14px;
font-weight: 600;
line-height: 20px;
border: 1px solid var(--ps-profile-border);
border-radius: 100px;
background: transparent;
cursor: pointer;
transition: color .2s ease, border-color .2s ease;
}
html body .gc-main-content.gc-user-user.ps-public-profile-page .xdget-profileLike .button:is(:hover, :focus-visible) {
color: var(--ps-profile-primary-hover);
border-color: var(--ps-profile-primary-hover);
}
html body .gc-main-content.gc-user-user.ps-public-profile-page .xdget-header {
margin: 0 0 24px !important;
color: var(--ps-profile-text) !important;
font: 500 22px/31px Inter, Arial, sans-serif !important;
letter-spacing: -.7px;
}
html body .gc-main-content.gc-user-user.ps-public-profile-page .xdget-profileTrainings {
min-height: 80px;
padding: 20px;
color: var(--ps-profile-text);
font-size: 14px;
line-height: 20px;
border: 1px solid var(--ps-profile-border);
border-radius: 12px;
background: var(--ps-profile-canvas);
}
html body .gc-main-content.gc-user-user.ps-public-profile-page .xdget-profileTrainings > .fa {
margin-right: 8px;
color: var(--ps-profile-primary);
}
html body .gc-main-content.gc-user-user.ps-public-profile-page .xdget-profileTrainings .label-success {
display: inline-flex;
align-items: center;
margin-left: 8px;
padding: 6px 8px;
color: var(--ps-profile-primary-hover);
font-size: 10px;
font-weight: 600;
line-height: 14px;
border-radius: 8px;
background: rgba(50, 75, 186, .12);
}
html body :where(.gc-main-content.gc-user-user.ps-profile-page, .gc-main-content.gc-user-user.ps-profile-settings-page),
html body :where(.gc-main-content.gc-user-user.ps-profile-page, .gc-main-content.gc-user-user.ps-profile-settings-page) *,
html body :where(.gc-main-content.gc-user-user.ps-profile-page, .gc-main-content.gc-user-user.ps-profile-settings-page) *::before,
html body :where(.gc-main-content.gc-user-user.ps-profile-page, .gc-main-content.gc-user-user.ps-profile-settings-page) *::after {
box-sizing: border-box;
}
html body :where(.gc-main-content.gc-user-user.ps-profile-page, .gc-main-content.gc-user-user.ps-profile-settings-page) :where(button, input, select, textarea) {
font-family: Inter, Arial, sans-serif !important;
}
html body :where(.gc-main-content.gc-user-user.ps-profile-page, .gc-main-content.gc-user-user.ps-profile-settings-page) > .container {
width: 100% !important;
max-width: none !important;
min-height: 100vh;
margin: 0 !important;
padding: 64px 24px 64px !important;
}
html body :where(.gc-main-content.gc-user-user.ps-profile-page, .gc-main-content.gc-user-user.ps-profile-settings-page) :where(.gc-account-logo, .standard-logo, .empty-breadcrumbs, .breadcrumbs) {
display: none !important;
}
html body .gc-main-content.gc-user-user.ps-profile-page .page-header {
display: flex;
width: 100%;
align-items: center;
justify-content: space-between;
gap: 24px;
margin: 0 0 24px !important;
padding: 0 !important;
border: 0 !important;
background: transparent !important;
}
html body .gc-main-content.gc-user-user.ps-profile-page .page-header h1,
html body .gc-main-content.gc-user-user.ps-profile-settings-page h1 {
margin: 0 !important;
color: var(--ps-profile-text) !important;
font: 500 40px/40px Inter, Arial, sans-serif !important;
letter-spacing: -1.6px !important;
}
html body .gc-main-content.gc-user-user.ps-profile-page .page-actions {
display: flex;
align-items: center;
gap: 8px;
margin: 0 !important;
float: none !important;
}
html body .gc-main-content.gc-user-user.ps-profile-page .page-actions :where(.btn, button, a) {
display: inline-flex;
min-height: 44px;
align-items: center;
justify-content: center;
padding: 10px 18px !important;
color: var(--ps-profile-text) !important;
font-size: 14px !important;
font-weight: 600 !important;
line-height: 20px !important;
text-decoration: none !important;
border: 1px solid var(--ps-profile-border) !important;
border-radius: 100px !important;
background: var(--ps-profile-surface) !important;
box-shadow: none !important;
transform: none !important;
transition: color .2s ease, border-color .2s ease, background-color .2s ease !important;
}
html body .gc-main-content.gc-user-user.ps-profile-page .page-actions :where(.btn, button, a):is(:hover, :focus-visible) {
color: var(--ps-profile-primary-hover) !important;
border-color: var(--ps-profile-primary-hover) !important;
background: var(--ps-profile-surface) !important;
outline: 0 !important;
}
html body .gc-main-content.gc-user-user.ps-profile-page .page-actions .dropdown-menu {
min-width: 240px;
margin-top: 8px;
padding: 8px;
border: 1px solid var(--ps-profile-border);
border-radius: 12px;
background: var(--ps-profile-surface);
box-shadow: 0 16px 40px rgba(30, 32, 37, .12);
}
html body .gc-main-content.gc-user-user.ps-profile-page .page-actions .dropdown-menu a {
width: 100%;
min-height: 40px;
justify-content: flex-start;
padding: 10px 12px !important;
border: 0 !important;
border-radius: 8px !important;
}
html body .gc-main-content.gc-user-user.ps-profile-page .page-actions .dropdown-menu a:is(:hover, :focus-visible) {
color: var(--ps-profile-text) !important;
background: var(--ps-profile-surface-hover) !important;
}
html body :where(.gc-main-content.gc-user-user.ps-profile-page .content-menu, .gc-main-content.gc-user-user.ps-profile-settings-page .standard-page-menu) {
width: 100%;
margin: 0 0 40px !important;
padding: 0 !important;
border: 0 !important;
background: transparent !important;
}
html body :where(.gc-main-content.gc-user-user.ps-profile-page .content-menu .page-menu, .gc-main-content.gc-user-user.ps-profile-settings-page .standard-page-menu) {
display: flex;
width: max-content;
max-width: 100%;
gap: 4px;
margin: 0 !important;
padding: 4px !important;
overflow-x: auto;
list-style: none;
border: 1px solid var(--ps-profile-border) !important;
border-radius: 100px !important;
background: var(--ps-profile-surface) !important;
scrollbar-width: none;
}
html body :where(.gc-main-content.gc-user-user.ps-profile-page .content-menu .page-menu, .gc-main-content.gc-user-user.ps-profile-settings-page .standard-page-menu)::-webkit-scrollbar {
display: none;
}
html body :where(.gc-main-content.gc-user-user.ps-profile-page .content-menu li, .gc-main-content.gc-user-user.ps-profile-settings-page .standard-page-menu li) {
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
background: transparent !important;
}
html body :where(.gc-main-content.gc-user-user.ps-profile-page .content-menu a, .gc-main-content.gc-user-user.ps-profile-settings-page .standard-page-menu a) {
display: flex !important;
min-height: 40px;
align-items: center;
justify-content: center;
padding: 10px 16px !important;
color: var(--ps-profile-muted) !important;
font-size: 14px !important;
font-weight: 500 !important;
line-height: 20px !important;
white-space: nowrap;
text-decoration: none !important;
border: 0 !important;
border-radius: 100px !important;
background: transparent !important;
transform: none !important;
transition: color .2s ease, background-color .2s ease !important;
}
html body :where(.gc-main-content.gc-user-user.ps-profile-page .content-menu li.active a, .gc-main-content.gc-user-user.ps-profile-page .content-menu a.active, .gc-main-content.gc-user-user.ps-profile-settings-page .standard-page-menu li.active a, .gc-main-content.gc-user-user.ps-profile-settings-page .standard-page-menu a.active) {
color: var(--ps-profile-text) !important;
background: var(--ps-profile-surface-hover) !important;
}
html body :where(.gc-main-content.gc-user-user.ps-profile-page .content-menu a, .gc-main-content.gc-user-user.ps-profile-settings-page .standard-page-menu a):is(:hover, :focus-visible) {
color: var(--ps-profile-text) !important;
background: var(--ps-profile-surface-hover) !important;
outline: 0;
}
html body .gc-main-content.gc-user-user.ps-profile-page form.page-main-form {
width: 100%;
margin: 0 !important;
padding: 32px !important;
color: var(--ps-profile-text);
border: 0 !important;
border-radius: 16px;
background: var(--ps-profile-surface);
box-shadow: none !important;
}
html body .gc-main-content.gc-user-user.ps-profile-page form.page-main-form :where(.row, [class*="col-md-"]) {
margin-right: 0 !important;
margin-left: 0 !important;
}
html body .gc-main-content.gc-user-user.ps-profile-page form.page-main-form [class*="col-md-"] {
padding-right: 0 !important;
padding-left: 0 !important;
}
html body .gc-main-content.gc-user-user.ps-profile-page .ps-profile-account {
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
align-items: end;
gap: 16px 24px;
margin: 0 0 32px !important;
padding: 0 0 32px !important;
border-bottom: 1px solid var(--ps-profile-border);
}
html body .gc-main-content.gc-user-user.ps-profile-page .change-password-form {
margin: 0 0 32px !important;
padding: 24px !important;
border: 1px solid var(--ps-profile-border);
border-radius: 12px;
background: var(--ps-profile-canvas);
}
html body .gc-main-content.gc-user-user.ps-profile-page .dotted-link {
display: inline-flex;
align-items: center;
padding: 0 0 2px;
color: var(--ps-profile-primary) !important;
font-size: 14px;
font-weight: 600;
line-height: 20px;
text-decoration: none !important;
border: 0 !important;
border-bottom: 1px solid currentColor !important;
cursor: pointer;
}
html body .gc-main-content.gc-user-user.ps-profile-page .dotted-link:is(:hover, :focus-visible) {
color: var(--ps-profile-primary-hover) !important;
outline: 0;
}
html body .gc-main-content.gc-user-user.ps-profile-page .user-data {
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 32px;
width: 100%;
margin: 0 !important;
}
html body .gc-main-content.gc-user-user.ps-profile-page .ps-profile-account::before,
html body .gc-main-content.gc-user-user.ps-profile-page .ps-profile-account::after,
html body .gc-main-content.gc-user-user.ps-profile-page .user-data::before,
html body .gc-main-content.gc-user-user.ps-profile-page .user-data::after,
html body .gc-main-content.gc-user-user.ps-profile-page .row.buttons::before,
html body .gc-main-content.gc-user-user.ps-profile-page .row.buttons::after {
display: none !important;
content: none !important;
}
html body .gc-main-content.gc-user-user.ps-profile-page .user-data > .ps-profile-section {
width: auto !important;
min-width: 0;
float: none !important;
}
html body .gc-main-content.gc-user-user.ps-profile-page .ps-profile-section-title {
margin: 0 0 24px !important;
color: var(--ps-profile-text) !important;
font: 500 22px/31px Inter, Arial, sans-serif !important;
letter-spacing: -.7px;
}
html body .gc-main-content.gc-user-user.ps-profile-page .ps-profile-about {
margin-top: 32px !important;
padding-top: 32px !important;
border-top: 1px solid var(--ps-profile-border);
}
html body .gc-main-content.gc-user-user.ps-profile-page .form-group {
width: 100%;
margin: 0 0 16px !important;
}
html body .gc-main-content.gc-user-user.ps-profile-page .form-group > label,
html body .gc-main-content.gc-user-user.ps-profile-page .control-label {
display: block;
margin: 0 0 8px !important;
color: var(--ps-profile-muted) !important;
font-size: 12px !important;
font-weight: 500 !important;
line-height: 17px !important;
}
html body .gc-main-content.gc-user-user.ps-profile-page :where(.form-control, input[type="text"], input[type="email"], input[type="password"], input[type="tel"], input[type="date"], select, textarea) {
width: 100% !important;
min-height: 52px;
padding: 14px 16px !important;
color: var(--ps-profile-text) !important;
font-size: 14px !important;
font-weight: 400 !important;
line-height: 20px !important;
border: 1px solid var(--ps-profile-border) !important;
border-radius: 12px !important;
background: var(--ps-profile-surface) !important;
box-shadow: none !important;
outline: 0 !important;
transition: border-color .2s ease !important;
}
html body .gc-main-content.gc-user-user.ps-profile-page textarea {
min-height: 128px;
resize: vertical;
}
html body .gc-main-content.gc-user-user.ps-profile-page :where(.form-control, input, select, textarea):focus {
border-color: var(--ps-profile-primary-hover) !important;
box-shadow: 0 0 0 3px rgba(89, 118, 246, .12) !important;
}
html body .gc-main-content.gc-user-user.ps-profile-page :where(.input-group, .date) {
width: 100%;
}
html body .gc-main-content.gc-user-user.ps-profile-page .input-group {
display: flex;
align-items: stretch;
}
html body .gc-main-content.gc-user-user.ps-profile-page .input-group .form-control {
border-radius: 12px 0 0 12px !important;
}
html body .gc-main-content.gc-user-user.ps-profile-page .input-group-addon {
display: grid;
min-width: 48px;
place-items: center;
color: var(--ps-profile-muted);
border: 1px solid var(--ps-profile-border) !important;
border-left: 0 !important;
border-radius: 0 12px 12px 0 !important;
background: var(--ps-profile-surface-hover) !important;
}
html body .gc-main-content.gc-user-user.ps-profile-page :where(input[type="checkbox"], input[type="radio"]) {
accent-color: var(--ps-profile-primary);
}
html body .gc-main-content.gc-user-user.ps-profile-page :where(.help-block, .hint, .text-muted) {
margin: 6px 0 0 !important;
color: var(--ps-profile-tertiary) !important;
font-size: 12px !important;
line-height: 17px !important;
}
html body .gc-main-content.gc-user-user.ps-profile-page input[type="file"] {
width: 100%;
padding: 8px;
color: var(--ps-profile-muted);
border: 1px dashed var(--ps-profile-border);
border-radius: 12px;
background: var(--ps-profile-canvas);
}
html body .gc-main-content.gc-user-user.ps-profile-page input[type="file"]::file-selector-button {
margin-right: 12px;
padding: 10px 14px;
color: var(--ps-profile-text);
font-weight: 600;
border: 1px solid var(--ps-profile-border);
border-radius: 100px;
background: var(--ps-profile-surface);
cursor: pointer;
}
html body .gc-main-content.gc-user-user.ps-profile-page .row.buttons {
display: flex;
justify-content: flex-end;
margin: 32px 0 0 !important;
padding: 32px 0 0 !important;
border-top: 1px solid var(--ps-profile-border);
}
html body :where(.gc-main-content.gc-user-user.ps-profile-page .row.buttons, .gc-main-content.gc-user-user.ps-profile-page .change-password-form, .gc-main-content.gc-user-user.ps-profile-settings-page .buttons-row) :where(.btn-primary, .btn-success, button[type="submit"], input[type="submit"]) {
display: inline-flex;
min-width: 200px;
min-height: 52px;
align-items: center;
justify-content: center;
padding: 14px 24px !important;
color: #fff !important;
font-size: 14px !important;
font-weight: 600 !important;
line-height: 20px !important;
text-shadow: none !important;
border: 0 !important;
border-radius: 100px !important;
background: var(--ps-profile-primary) !important;
box-shadow: var(--ps-system-control-shadow) !important;
transform: none !important;
transition: background-color .2s ease !important;
}
html body :where(.gc-main-content.gc-user-user.ps-profile-page .row.buttons, .gc-main-content.gc-user-user.ps-profile-page .change-password-form, .gc-main-content.gc-user-user.ps-profile-settings-page .buttons-row) :where(.btn-primary, .btn-success, button[type="submit"], input[type="submit"]):is(:hover, :focus-visible) {
color: #fff !important;
background: var(--ps-profile-primary-hover) !important;
outline: 0 !important;
}
html body .gc-main-content.gc-user-user.ps-profile-settings-page > .container > .standard-page-content {
width: 100%;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
background: transparent !important;
}
html body .gc-main-content.gc-user-user.ps-profile-settings-page h1 {
margin-bottom: 24px !important;
}
html body .gc-main-content.gc-user-user.ps-profile-settings-page form {
width: 100%;
margin: 0 !important;
}
html body .gc-main-content.gc-user-user.ps-profile-settings-page form > .row {
width: 100%;
margin: 0 !important;
}
html body .gc-main-content.gc-user-user.ps-profile-settings-page form > .row > .col-md-8 {
width: 100% !important;
padding: 0 !important;
float: none !important;
}
html body .gc-main-content.gc-user-user.ps-profile-settings-page table.table {
width: 100%;
margin: 0 !important;
overflow: hidden;
border: 0 !important;
border-collapse: separate !important;
border-spacing: 0;
border-radius: 16px;
background: var(--ps-profile-surface);
box-shadow: none !important;
}
html body .gc-main-content.gc-user-user.ps-profile-settings-page table.table :where(th, td) {
height: 64px;
padding: 16px !important;
vertical-align: middle !important;
color: var(--ps-profile-text) !important;
font-size: 14px !important;
line-height: 20px !important;
border: 0 !important;
border-bottom: 1px solid var(--ps-profile-border) !important;
background: transparent !important;
}
html body .gc-main-content.gc-user-user.ps-profile-settings-page table.table th {
height: 56px;
color: var(--ps-profile-muted) !important;
font-size: 12px !important;
font-weight: 500 !important;
line-height: 17px !important;
text-align: left;
background: var(--ps-profile-canvas) !important;
}
html body .gc-main-content.gc-user-user.ps-profile-settings-page table.table tr:last-child td {
border-bottom: 0 !important;
}
html body .gc-main-content.gc-user-user.ps-profile-settings-page table.table td:first-child {
font-weight: 500 !important;
}
html body .gc-main-content.gc-user-user.ps-profile-settings-page table.table :where(select, .form-control) {
min-height: 40px;
padding: 9px 12px !important;
color: var(--ps-profile-text) !important;
border: 1px solid var(--ps-profile-border) !important;
border-radius: 10px !important;
background: var(--ps-profile-surface) !important;
box-shadow: none !important;
}
html body .gc-main-content.gc-user-user.ps-profile-settings-page table.table :where(select, .form-control):focus {
border-color: var(--ps-profile-primary-hover) !important;
outline: 0 !important;
}
html body .gc-main-content.gc-user-user.ps-profile-settings-page table.table input[type="checkbox"] {
width: 20px;
height: 20px;
margin: 0 !important;
accent-color: var(--ps-profile-primary);
}
html body .gc-main-content.gc-user-user.ps-profile-settings-page .buttons-row {
display: flex;
justify-content: flex-end;
margin: 24px 0 0 !important;
padding: 0 !important;
}
@media (max-width: 767px) {
body.ps-menu-installed .gc-main-content.with-left-menu {
margin-left: 0 !important;
}
#gcAccountUserMenu.ps-menu-ready .gc-account-leftbar {
inset: auto auto calc(8px + env(safe-area-inset-bottom, 0px)) 50% !important;
width: max-content !important;
max-width: calc(100vw - 16px) !important;
height: 64px !important;
border: 1px solid var(--pm-border) !important;
border-radius: 1000px !important;
background: var(--pm-bar) !important;
box-shadow: 0 10px 30px rgba(5, 8, 13, .22) !important;
transform: translateX(-50%);
}
#gcAccountUserMenu.ps-menu-ready .ps-menu {
width: max-content;
max-width: 100%;
height: 64px;
flex-direction: row;
justify-content: center;
gap: 0;
padding: 4px;
}
#gcAccountUserMenu.ps-menu-ready .ps-menu-main {
order: 1;
width: auto;
height: 56px;
flex-direction: row;
gap: 4px;
padding: 4px;
background: transparent;
}
#gcAccountUserMenu.ps-menu-ready .ps-menu-profile {
order: 2;
width: 56px;
height: 56px;
padding: 4px;
background: transparent;
}
#gcAccountUserMenu.ps-menu-ready .ps-menu-profile img {
width: 48px;
height: 48px;
}
#gcAccountUserMenu.ps-menu-ready .ps-menu-logout {
display: none !important;
}
#gcAccountUserMenu.ps-menu-ready [data-ps-tip]::before,
#gcAccountUserMenu.ps-menu-ready [data-ps-tip]::after {
display: none;
}
.ps-support-layer {
padding: 0 10px 0 0;
}
.ps-support-dialog {
width: 100%;
height: 100dvh;
max-height: none;
}
.ps-support-close {
position: fixed;
top: 12px;
right: 22px;
}
html body :where(.gc-main-content.gc-user-user.ps-profile-page, .gc-main-content.gc-user-user.ps-profile-settings-page) > .container {
padding: 24px 14px calc(112px + env(safe-area-inset-bottom, 0px)) !important;
}
html body .gc-main-content.gc-user-user.ps-public-profile-page > .container {
padding: 24px 14px calc(112px + env(safe-area-inset-bottom, 0px)) !important;
}
html body .gc-main-content.gc-user-user.ps-public-profile-page .ps-public-profile-header {
align-items: stretch;
flex-direction: column;
gap: 20px;
margin-bottom: 24px;
}
html body .gc-main-content.gc-user-user.ps-public-profile-page .xdget-profileTitle {
font-size: 30px !important;
line-height: 30px !important;
letter-spacing: -1.2px !important;
}
html body .gc-main-content.gc-user-user.ps-public-profile-page .edit-profile-popup-btn {
width: 100%;
}
html body .gc-main-content.gc-user-user.ps-public-profile-page .layout-fixwidth > .xdget-row {
grid-template-columns: 1fr;
}
html body .gc-main-content.gc-user-user.ps-public-profile-page .layout-fixwidth > .xdget-row > .xdget-container {
padding: 24px !important;
}
html body .gc-main-content.gc-user-user.ps-public-profile-page .xdget-profileAvatar img {
max-width: 160px !important;
}
html body .gc-main-content.gc-user-user.ps-profile-page .page-header {
align-items: flex-start;
flex-direction: column;
gap: 20px;
}
html body .gc-main-content.gc-user-user.ps-profile-page .page-header h1,
html body .gc-main-content.gc-user-user.ps-profile-settings-page h1 {
font-size: 30px !important;
line-height: 30px !important;
letter-spacing: -1.2px !important;
}
html body .gc-main-content.gc-user-user.ps-profile-page .page-actions {
width: 100%;
flex-wrap: wrap;
}
html body .gc-main-content.gc-user-user.ps-profile-page .page-actions > * {
flex: 1 1 auto;
}
html body .gc-main-content.gc-user-user.ps-profile-page .page-actions :where(.btn, button, a) {
width: 100%;
}
html body :where(.gc-main-content.gc-user-user.ps-profile-page .content-menu, .gc-main-content.gc-user-user.ps-profile-settings-page .standard-page-menu) {
margin-bottom: 24px !important;
}
html body .gc-main-content.gc-user-user.ps-profile-page form.page-main-form {
padding: 24px !important;
}
html body .gc-main-content.gc-user-user.ps-profile-page .ps-profile-account {
grid-template-columns: 1fr;
align-items: stretch;
}
html body .gc-main-content.gc-user-user.ps-profile-page .user-data {
grid-template-columns: 1fr;
gap: 32px;
}
html body .gc-main-content.gc-user-user.ps-profile-page .change-password-form {
padding: 20px !important;
}
html body .gc-main-content.gc-user-user.ps-profile-page .row.buttons,
html body .gc-main-content.gc-user-user.ps-profile-settings-page .buttons-row {
justify-content: stretch;
}
html body :where(.gc-main-content.gc-user-user.ps-profile-page .row.buttons, .gc-main-content.gc-user-user.ps-profile-page .change-password-form, .gc-main-content.gc-user-user.ps-profile-settings-page .buttons-row) :where(.btn-primary, .btn-success, button[type="submit"], input[type="submit"]) {
width: 100%;
}
html body .gc-main-content.gc-user-user.ps-profile-settings-page table.table {
display: block;
overflow: visible;
border-radius: 0;
background: transparent;
}
html body .gc-main-content.gc-user-user.ps-profile-settings-page table.table thead {
display: none;
}
html body .gc-main-content.gc-user-user.ps-profile-settings-page table.table tbody {
display: flex;
width: 100%;
flex-direction: column;
gap: 16px;
}
html body .gc-main-content.gc-user-user.ps-profile-settings-page table.table tr {
display: grid;
width: 100%;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 16px;
padding: 20px;
border-radius: 16px;
background: var(--ps-profile-surface);
}
html body .gc-main-content.gc-user-user.ps-profile-settings-page table.table td {
display: flex;
width: auto !important;
min-width: 0;
height: auto;
min-height: 0;
flex-direction: column;
align-items: flex-start;
justify-content: space-between;
gap: 8px;
padding: 0 !important;
border: 0 !important;
}
html body .gc-main-content.gc-user-user.ps-profile-settings-page table.table td:first-child,
html body .gc-main-content.gc-user-user.ps-profile-settings-page table.table td:nth-child(2) {
grid-column: 1 / -1;
}
html body .gc-main-content.gc-user-user.ps-profile-settings-page table.table td:first-child {
padding-bottom: 16px !important;
font-size: 16px !important;
line-height: 22px !important;
border-bottom: 1px solid var(--ps-profile-border) !important;
}
html body .gc-main-content.gc-user-user.ps-profile-settings-page table.table td::before {
content: attr(data-label);
color: var(--ps-profile-muted);
font-size: 10px;
font-weight: 500;
line-height: 14px;
text-transform: uppercase;
}
html body .gc-main-content.gc-user-user.ps-profile-settings-page table.table td:first-child::before,
html body .gc-main-content.gc-user-user.ps-profile-settings-page table.table td.ps-profile-empty-cell {
display: none !important;
}
html body .gc-main-content.gc-user-user.ps-profile-settings-page table.table :where(select, .form-control) {
width: 100%;
}
}
@media (max-width: 767px) {
body:has(#gcAccountUserMenu.ps-menu-ready) .ps-profile-layer {
left: 0;
}
.ps-profile-panel {
padding: 24px 14px calc(112px + env(safe-area-inset-bottom, 0px));
}
.ps-profile-panel-header {
align-items: center;
margin-bottom: 20px;
}
.ps-profile-panel-header h1 {
font-size: 30px;
line-height: 30px;
letter-spacing: -1.2px;
}
.ps-profile-panel-close {
width: 44px;
height: 44px;
flex-basis: 44px;
}
.ps-profile-panel-nav {
width: 100%;
margin-bottom: 24px;
}
.ps-profile-panel-status {
margin-bottom: 12px;
}
.ps-profile-panel-loading,
.ps-profile-panel-error {
min-height: 220px;
padding: 24px;
}
}
@media (prefers-reduced-motion: reduce) {
#gcAccountUserMenu.ps-menu-ready :where(.ps-menu-btn, .ps-menu-profile, .ps-menu-profile > .ps-menu-icon),
.ps-support-layer,
.ps-support-dialog,
.ps-support-close,
.ps-profile-layer,
.ps-profile-panel-close,
.ps-profile-panel-nav__item,
html body :where(.gc-main-content.gc-user-user.ps-profile-page, .gc-main-content.gc-user-user.ps-profile-settings-page) * {
transition-duration: .01ms !important;
}
}